import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import '../../../app_files.dart';
import 'action.dart';
import 'state.dart';

Widget buildView(
    SearchViewState state, Dispatch dispatch, ViewService viewService) {
  return Scaffold(
    body: GestureDetector(
      child: Container(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              decoration: BoxDecoration(
                color: ThemeConfig.mainColor,
                border:
                    Border(bottom: BorderSide(color: ThemeConfig.separeColor)),
              ),
              padding: EdgeInsets.only(
                  top: ScreenUtil.statusBarHeight + 12, bottom: 12),
              child: Row(
                children: <Widget>[
                  Expanded(
                    child: Hero(
                      tag: state.heroTag,
                      child: Material(
                        color: ThemeConfig.mainColor,
                        child: Container(
                          margin: EdgeInsets.only(left: 15,top: 15,bottom: 15,right: 5),
                          height: 40,
                          padding: EdgeInsets.only(left: 14),
                          decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.all(
                              Radius.circular(20),
                            ),
                          ),
                          child: Row(
                            children: <Widget>[
                              Padding(
                                padding: EdgeInsets.only(bottom: 1),
                                child: Image.asset('images/icon_search.png'),
                              ),
                              Padding(padding: EdgeInsets.only(left: 8)),
                              Expanded(
                                child: TextField(
                                  style: TextStyle(fontSize: 14),
                                  autofocus: true,
                                  controller: TextEditingController(
                                      text: state.keyword),
                                  onSubmitted: (String value) => dispatch(
                                      SearchViewActionCreator.onSearch(value)),
                                  textInputAction: TextInputAction.search,
                                  decoration: InputDecoration(
                                    border: InputBorder.none,
                                    hintText: state.type != 2
                                        ? "搜索"
                                        : state.isAddress == 1
                                        ? '搜索楼号'
                                        : '搜索户名/联系方式',
                                    hintStyle: TextStyle(
                                        color: ThemeConfig.black153Color, fontSize: 14),
                                    contentPadding: EdgeInsets.only(bottom: 9),
                                  ),
                                ),
                              ),
                              state.type == 2
                                  ? Padding(
                                padding: EdgeInsets.only(right: 12),
                                child: MyInkWellWidget(
                                  child: Row(
                                    children: [
                                      Icon(
                                        Icons.swap_horiz,
                                        size: 15,
                                        color: ThemeConfig.mainColor,
                                      ),
                                      Padding(
                                        padding: EdgeInsets.only(left: 3),
                                      ),
                                      Text(
                                        state.isAddress == 0
                                            ? '搜楼号'
                                            : '搜户名',
                                        style: TextThemeConfig
                                            .Font14WithMainColor,
                                      ),
                                    ],
                                  ),
                                  onTap: () {
                                    state.isAddress =
                                    state.isAddress == 1 ? 0 : 1;
                                    dispatch(SearchViewActionCreator
                                        .onAction());
                                  },
                                ),
                              )
                                  : Container(),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                  Container(
                    width: 55,
                    child: InkWell(
                      child: Container(
                        color: ThemeConfig.mainColor,
                        child: Center(
                          child: Padding(
                            padding: EdgeInsets.only(bottom: 1),
                            child: Text(
                              '取消',
                              style: TextThemeConfig.Font14WithColorWhite,
                            ),
                          ),
                        ),
                      ),
                      onTap: () {
                        FocusScope.of(viewService.context)
                            .requestFocus(FocusNode());
                        Navigator.pop(viewService.context);
                      },
                    ),
                  )
                ],
              ),
            ),
            Expanded(
              child: Container(
                child: CustomScrollView(
                  slivers: [
                    SliverToBoxAdapter(
                      child: Container(
                        color: Colors.white,
                        padding: EdgeInsets.only(
                            left: 20, right: 20, top: 24, bottom: 15),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Row(
                              children: <Widget>[
                                Text(
                                  '历史搜索',
                                  style: TextThemeConfig.Font14WithColor22,
                                ),
                                Expanded(child: Container()),
                                InkWell(
                                  onTap: () => dispatch(
                                      SearchViewActionCreator.onClear()),
                                  child: Container(
                                    child: Center(
                                      child:
                                          Image.asset('images/ic_delete.png'),
                                    ),
                                  ),
                                )
                              ],
                            ),
                            Padding(padding: EdgeInsets.only(bottom: 15)),
                            state.historyList != null
                                ? Container(
                                    child: Wrap(
                                      alignment: WrapAlignment.start,
                                      spacing: 8.0, // 主轴(水平)方向间距
                                      runSpacing: 12.0, // 纵轴（垂直）方向间距
                                      children:
                                          state.historyList.map<Widget>((str) {
                                        return InkWell(
                                          child: Container(
                                            height: 24,
                                            padding: EdgeInsets.symmetric(
                                                horizontal: 8, vertical: 4),
                                            decoration: BoxDecoration(
                                              color: Color(0xFFF1F1F2),
                                              borderRadius: BorderRadius.all(
                                                  Radius.circular(4)),
                                            ),
                                            child: Text(
                                              str,
                                              maxLines: 1,
                                              style: TextThemeConfig
                                                  .Font12WithColor22,
                                            ),
                                          ),
                                          onTap: () {
                                            dispatch(SearchViewActionCreator
                                                .onSearch(str));
                                          },
                                        );
                                      }).toList(),
                                    ),
                                  )
                                : Container()
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
      onTap: () => FocusScope.of(viewService.context).requestFocus(FocusNode()),
    ),
  );
}
